{block name=head}
<style type="text/css">
  #wrap{
  color:#
  }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    filterList($("#form"), $("#list"));
	});
//(function ($) {
//  jQuery.expr[':'].Contains = function(a,i,m){
//      return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;
//  };
//       	alert('a');
//  function filterList(header, list) {
//    var form = $("form").attr({
//    class:"filterform",
//    action:"#"}),
//    input = $("input").attr({
//    class:"filterinput",
//    type:"text"});
//    $(form).append(input).appendTo(header);
// 
//    $('input').change( function () {
//
//        var filter = $(this).val();
//        if(filter) {
// 
//          $matches = $(list).find('a:Contains(' + filter + ')').parent();
//          $('li', list).not($matches).slideUp();
//          $matches.slideDown();
// 
//        } else {
//          $(list).find("li").slideDown();
//        }
//        return false;
//      })
//    .keyup( function () {
//        $(this).change();
//    });
//  }	
// 
//  $(function () {
//    filterList($("#form"), $("#list"));
//  });
//});
  function filterList(header, list) {
    var form = $("#form").attr({ class:"filterform", action:"#"}), 
    input = $("input").attr({ class:"filterinput", type:"text"});
    $(form).append(input).appendTo(header);
    var list = $("#list");
    $(input).keyup( function () {

        var filter = $(this).val();
        if(filter) {
 
          $matches = $(list).find('a:Contains(' + filter + ')').parent();
          $('li', list).not($matches).slideUp();
          $matches.slideDown();
 
        } else {
          $(list).find("li").slideDown();
        }
        return false;
      })
  }
</script>
{/block}
{block name=body}

<div id="wrap">
<div class="product-head">
  <h1>Product Search</h1>
  <input class="input" onchange="filterList();"/>
    <div id="form"></div>
    <div class="clear"></div>
</div>
  <ul id="list">
{section name=sec loop=$cityArray}
<li> <a href="" >
  {$cityArray[sec].partyName}
</a></li>
{/section}
</ul>
</div>
{/block}
<!--http://papermashup.com-->
